<template>
    <VideoBanner/>



    <ProductSwiper :products="homeStore.$state.products"/>

    <div class="cover1">
        <div class="cover1-discribes">
            <div class="cover1-discribe">傅利叶智能联合实验室</div>
            <div>傅利叶智能目前已与全球5家顶尖院校、研究中心、康复中心建立联合实验室，共同研发具有前瞻性的康复技术，实现课题联动，推动国际顶尖科技的落地应用，努力提升智能康复技术的可及性，为广大用户带来优质的康复服务。</div>
        </div>
    </div>
  </template>
  
  <script setup lang="ts">
  import { defineComponent, onMounted } from 'vue';
  import VideoBanner from './VideoBanner.vue';
  import ProductSwiper from './ProductSwiper.vue';
  import{IndexStore} from "../../store/index"
import { ElMessage } from 'element-plus';
  defineComponent({
    VideoBanner,
    ProductSwiper,
  })

  const homeStore = IndexStore()


  onMounted(()=>{
    console.log("HelloWorld??");
    ElMessage({
        message:"success!",
        type:"success"
    })
    console.log("??");
    
  })
  </script>
  
  <style lang="less" scoped>
      .cover1{
        width: 100%;
        height: 50%;
        background-color: aquamarine;
        background-image: url("/index/bg3.jpg");
        background-size: cover;
        background-position: top;
        display: flex;
            justify-content: center;
            align-items: center;
        .cover1-discribes{
            display: flex;
            flex-direction: column;
            align-items: center;
            padding-bottom: 3rem;

            :nth-child(1){
                font-size: 4rem;
                padding-bottom: 4rem;
            }
            :nth-child(2){
                width: 80%;
                font-size: 1.8rem;
                padding-bottom: 4rem;
                color: rgb(75, 75, 75);
            }
        }
    }
  </style>
  